<template>
  <div class="checkInput">
        <el-form-item :prop="currentData.key" :label="currentData.displayName" :rules="rules">
               <el-checkbox-group v-for="item in data.checkItems" :key="item.value" v-model="currentData.value">
                    <el-checkbox :label="item.label" :value="item.value" :name="currentData.key"></el-checkbox>
               </el-checkbox-group>
       </el-form-item>
  </div>
</template>
<script lang="ts">
 
import { Component, Vue,Prop} from 'vue-property-decorator';
@Component({
  components: {
  },
})
export default class FormInput extends Vue {
     @Prop() public data!: any;
     private value:any="";
     private rules=[];
     async created(){
          this.value=this.currentData.name;
          this.rules=[{
               required: true, message: '不能为空', trigger: 'blur'
          }];
     }
     public get currentData(){
          return this.data;
     }
     
}
</script>
<style lang="less">
    .checkInput{
         width: calc(100% - 160px);
         display: flex;
         margin-left: 60px;
         margin-top: 10px;
         .content{
              width: 100%;
              .el-checkbox-group{
                  margin-left: 10px;
                  margin-top: 10px;
              }
              display: flex;  
              flex-direction: row;
              flex-wrap: wrap;
         }
         .el-form-item__content{
              display: flex;
              flex-wrap: wrap;
         }
         .el-checkbox-group{
              margin-left: 20px;
         }
    }
</style>
